$(function() {
	var i = 0;
	fetch('./list.do?type=json&page=0',{credentials: 'same-origin'})
	.then(function(response) {
		return response.json();
	}).then(
			function(articles) {
				var $ul = $('#list-articles');
				articles.forEach(function(art) {
					$ul.append('<li class="list-group-item">' 
							+ '<h3>' + art.title + '</h3>' 
							+ '<p>user: ' + art.username + '</p>' 
							+ '<p>time: ' + art.publishDate + '</p>'
							+ '<p>' + art.content + '</p>' 
							+ '</li>');
				})
			})
	
	function doGet(number){
		var url;
		if(!isNaN(number)){
			url = './list.do?type=json&page=' + number;
		}else{
			url = './list.do?type=json&page=0';
		}
		fetch(url,{credentials: 'same-origin'})
		.then(function(response) {
			return response.json();
		}).then(
				function(articles) {
					var $ul = $('#list-articles');
					articles.forEach(function(art) {
						$ul.append('<li class="list-group-item">' 
								+ '<h3>' + art.title + '</h3>' 
								+ '<p>user: ' + art.username + '</p>' 
								+ '<p>time: ' + art.publishDate + '</p>'
								+ '<p>' + art.content + '</p>' 
								+ '</li>');
					})
				})
	}
	
	$(window).scroll(function() {
		var scrollTop = $(this).scrollTop();
		var scrollHeight = $(document).height();
		var windowHeight = $(this).height();
		if (scrollTop + windowHeight == scrollHeight) {
			i++;
			doGet(i);
		}
	});
	
})
